{% extends "main.html" %}
{% block title %}Create HIT Template{% endblock %}
{% block head %}
<link rel="stylesheet" href="/control/editor/style.css" />
<script type="text/javascript" src="/js/tabs.js"></script>
<script type="text/javascript" src="/js/HITPreview.js"></script>
<script type="text/javascript" src="/js/getCampaign.js"></script>
<script type="text/javascript" src="/js/HitTemplateSelector.js"></script>
<script type="text/javascript" src="/js/WorkerQualification.js"></script>
<script type="text/javascript" src="/js/CreateHIT.js"></script>
<script type="text/javascript" src="/control/editor/editor.js"></script>
{% endblock %}

{% block pageHeader %}
{% include "templates/navigation.html" %}
{% endblock %}

{% block content %}
<form action="/create/hit" enctype='multipart/form-data' method="post" id="createhitform">
	<div class='warning'>{{message}}</div>
    <div class="tabs">
        <ul class="tabsNav">
            <li class="selected"><a class="step1" href="#tab-1"><span>Select Client + Campaign</span></a></li>
            <li><a class="step2" href="#tab-2"><span>Choose Template</span></a></li>
            <li><a class="step3" href="#tab-3"><span>Enter Question</span></a></li>
        </ul>
        <!-- Step 1 -->
        <div id="tab-1" class="panel">
            {% include "createhitstep/step1.html" %}
        </div>
        <!-- Step 2 -->
        <div id="tab-2" class="panel">
            {% include "templates/HITPropertiesSetting.html" %}
        </div>
        <!-- Step 3 -->
        <div id="tab-3" class="panel">
    	{% include "createhitstep/step3.html" %}
        </div>
    </div>
</form>
{% endblock %}

{% block footer %}
<script type='text/javascript'>
$(document).ready(function(){
	$("#ddl_hit_template").change();
	$("#question_template_name").change();
})
</script>
{% include "templates/copyright.html" %}
{% endblock %}
